<!DOCTYPE html>
<html  lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <!--360浏览器优先以webkit内核解析-->
    <title>若依介绍</title>
    <link rel="shortcut icon" href="favicon.ico">
    <link href="../static/css/bootstrap.min.css" th:href="@{/css/bootstrap.min.css}" rel="stylesheet"/>
    <link href="../static/css/font-awesome.min.css" th:href="@{/css/font-awesome.min.css}" rel="stylesheet"/>
    <link href="../static/css/main/animate.min.css" th:href="@{/css/main/animate.min.css}" rel="stylesheet"/>
    <link href="../static/css/main/style.min862f.css" th:href="@{/css/main/style.min862f.css}" rel="stylesheet"/>
</head>

<body class="gray-bg">
<div class="wrapper wrapper-content">
	<div class="row">
		<div class="col-sm-3">
			<div class="ibox float-e-margins">
				<div class="ibox-title">
					<span class="label label-success pull-right">月</span>
					<h5>收入</h5>
				</div>
				<div class="ibox-content">
					<h1 class="no-margins">40 886,200</h1>
					<div class="stat-percent font-bold text-success">98% <i class="fa fa-bolt"></i>
					</div>
					<small>总收入</small>
				</div>
			</div>
		</div>
		<div class="col-sm-3">
			<div class="ibox float-e-margins">
				<div class="ibox-title">
					<span class="label label-info pull-right">全年</span>
					<h5>订单</h5>
				</div>
				<div class="ibox-content">
					<h1 class="no-margins">275,800</h1>
					<div class="stat-percent font-bold text-info">20% <i class="fa fa-level-up"></i>
					</div>
					<small>新订单</small>
				</div>
			</div>
		</div>
		<div class="col-sm-3">
			<div class="ibox float-e-margins">
				<div class="ibox-title">
					<span class="label label-primary pull-right">今天</span>
					<h5>访客</h5>
				</div>
				<div class="ibox-content">
					<h1 class="no-margins">106,120</h1>
					<div class="stat-percent font-bold text-navy">44% <i class="fa fa-level-up"></i>
					</div>
					<small>新访客</small>
				</div>
			</div>
		</div>
		<div class="col-sm-3">
			<div class="ibox float-e-margins">
				<div class="ibox-title">
					<span class="label label-danger pull-right">最近一个月</span>
					<h5>活跃用户</h5>
				</div>
				<div class="ibox-content">
					<h1 class="no-margins">80,600</h1>
					<div class="stat-percent font-bold text-danger">38% <i class="fa fa-level-down"></i>
					</div>
					<small>12月</small>
				</div>
			</div>
		</div>
	</div>
	<div class="row">
		<div class="col-sm-12">
			<div class="ibox float-e-margins">
				<div class="ibox-title">
					<h5>订单</h5>
					<div class="pull-right">
						<div class="btn-group">
							<button type="button" class="btn btn-xs btn-white active">天</button>
							<button type="button" class="btn btn-xs btn-white">月</button>
							<button type="button" class="btn btn-xs btn-white">年</button>
						</div>
					</div>
				</div>
				<div class="ibox-content">
					<div class="row">
						<div class="col-sm-9">
							<div class="flot-chart">
								<div class="flot-chart-content" id="flot-dashboard-chart" style="padding: 0px; position: relative;"><canvas class="base" width="706" height="200"></canvas><canvas class="overlay" width="706" height="200" style="position: absolute; left: 0px; top: 0px;"></canvas><div class="tickLabels" style="font-size:smaller"><div class="xAxis x1Axis" style="color:#838383"><div class="tickLabel" style="position:absolute;text-align:center;left:56px;top:185px;width:58px">1月 3</div><div class="tickLabel" style="position:absolute;text-align:center;left:121px;top:185px;width:58px">1月 6</div><div class="tickLabel" style="position:absolute;text-align:center;left:185px;top:185px;width:58px">1月 9</div><div class="tickLabel" style="position:absolute;text-align:center;left:249px;top:185px;width:58px">1月 12</div><div class="tickLabel" style="position:absolute;text-align:center;left:313px;top:185px;width:58px">1月 15</div><div class="tickLabel" style="position:absolute;text-align:center;left:377px;top:185px;width:58px">1月 18</div><div class="tickLabel" style="position:absolute;text-align:center;left:442px;top:185px;width:58px">1月 21</div><div class="tickLabel" style="position:absolute;text-align:center;left:506px;top:185px;width:58px">1月 24</div><div class="tickLabel" style="position:absolute;text-align:center;left:570px;top:185px;width:58px">1月 27</div><div class="tickLabel" style="position:absolute;text-align:center;left:634px;top:185px;width:58px">1月 30</div></div><div class="yAxis y1Axis" style="color:#838383"><div class="tickLabel" style="position:absolute;text-align:right;top:173px;right:682px;width:24px">0</div><div class="tickLabel" style="position:absolute;text-align:right;top:131px;right:682px;width:24px">250</div><div class="tickLabel" style="position:absolute;text-align:right;top:90px;right:682px;width:24px">500</div><div class="tickLabel" style="position:absolute;text-align:right;top:49px;right:682px;width:24px">750</div><div class="tickLabel" style="position:absolute;text-align:right;top:8px;right:682px;width:24px">1000</div></div><div class="yAxis y2Axis" style="color:#838383"><div class="tickLabel" style="position:absolute;text-align:left;top:173px;left:694px;width:12px">0</div><div class="tickLabel" style="position:absolute;text-align:left;top:143px;left:694px;width:12px">5</div><div class="tickLabel" style="position:absolute;text-align:left;top:114px;left:694px;width:12px">10</div><div class="tickLabel" style="position:absolute;text-align:left;top:85px;left:694px;width:12px">15</div><div class="tickLabel" style="position:absolute;text-align:left;top:55px;left:694px;width:12px">20</div><div class="tickLabel" style="position:absolute;text-align:left;top:26px;left:694px;width:12px">25</div><div class="tickLabel" style="position:absolute;text-align:left;top:-3px;left:694px;width:12px">30</div></div></div><div class="legend"><div style="position: absolute; width: 52px; height: 30px; top: 9px; left: 34px; background-color: rgb(255, 255, 255); opacity: 0.85;"> </div><table style="position:absolute;top:9px;left:34px;;font-size:smaller;color:#838383"><tbody><tr><td class="legendColorBox"><div style="border:1px solid #000000;padding:1px"><div style="width:4px;height:0;border:5px solid #1ab394;overflow:hidden"></div></div></td><td class="legendLabel">订单数</td></tr><tr><td class="legendColorBox"><div style="border:1px solid #000000;padding:1px"><div style="width:4px;height:0;border:5px solid #464f88;overflow:hidden"></div></div></td><td class="legendLabel">付款数</td></tr></tbody></table></div></div>
							</div>
						</div>
						<div class="col-sm-3">
							<ul class="stat-list">
								<li>
									<h2 class="no-margins">2,346</h2>
									<small>订单总数</small>
									<div class="stat-percent">48% <i class="fa fa-level-up text-navy"></i>
									</div>
									<div class="progress progress-mini">
										<div style="width: 48%;" class="progress-bar"></div>
									</div>
								</li>
								<li>
									<h2 class="no-margins ">4,422</h2>
									<small>最近一个月订单</small>
									<div class="stat-percent">60% <i class="fa fa-level-down text-navy"></i>
									</div>
									<div class="progress progress-mini">
										<div style="width: 60%;" class="progress-bar"></div>
									</div>
								</li>
								<li>
									<h2 class="no-margins ">9,180</h2>
									<small>最近一个月销售额</small>
									<div class="stat-percent">22% <i class="fa fa-bolt text-navy"></i>
									</div>
									<div class="progress progress-mini">
										<div style="width: 22%;" class="progress-bar"></div>
									</div>
								</li>
							</ul></div>
					</div>
				</div>

			</div>
		</div>
	</div>
</div>
    <script th:src="@{/js/jquery.min.js}"></script>
    <script th:src="@{/js/bootstrap.min.js}"></script>
    <script th:src="@{/ajax/libs/layer/layer.min.js}"></script>
    <script type="text/javascript">
	    $('#pay-qrcode').click(function(){
	        var html=$(this).html();
	        parent.layer.open({
	            title: false,
	            type: 1,
	            closeBtn:false,
	            shadeClose:true,
	            area: ['600px', 'auto'],
	            content: html
	        });
	    });
    </script>
<script>
</script>
</body>
</html>
